<template>
  <view>
    <hx-navbar ref="hxnb" :config="config">
    </hx-navbar>
    <view>
      <clHeadTab class="tab-view" :modelData="modelData" @change="tabChange"></clHeadTab>
      <!-- <component :id="id" :data="listData" :ref="componentsName" :is="componentsName"></component> -->
      <info :id="id" :data="listData" v-show="componentsName == 'info'" ref="info"></info>
      <position :id="id" :data="listData" v-show="componentsName == 'position'" ref="position"></position>
    </view>
    <view class="fixed-btn">
      <u-button text="保存" @click="save()" type="primary" shape="circle"
        color="linear-gradient(to right, rgb(64, 158, 255), rgb(64, 158, 255), rgb(96, 180, 246), rgb(96, 180, 246))"></u-button>
    </view>
    <u-toast ref="uToast"></u-toast>
  </view>
</template>

<script>
import clHeadTab from "@/components/cl-head-tab/cl-head-tab.vue";
import clIcon from "@/components/cl-icon/cl-icon.vue";
import info from "./info/info.vue";
import position from "./position/position.vue";
import {
  addData,
  getCategoryList,
  getTypeList,
  initAddData,
  delectData,
  getIdData,
} from "@/apis/bill/information/warehouse";
export default {
  components: {
    clIcon,
    clHeadTab,
    info,
    position,
  },
  data() {
    return {
      componentsName: "info",
      search: null,
      modelData: [
        { label: "信息", name: "info" },
        { label: "仓位", name: "position" },
      ],
      config: {
        title: "仓库",
        color: "#ffffff",
        //背景颜色;参数一：透明度（0-1）;参数二：背景颜色（array则为线性渐变，string为单色背景）
        backgroundColor: [1, ["#409EFF", "#409EFF", "#60b4f6", "#60b4f6"]],
      },
      id: null,
      listData: {}
    };
  },
  computed: {},
  onLoad() {
    this.id = this.$Route.query.id || null;

  },
  created() {
    if (this.id) {
      this.getIdDatas(this.id);
    } else {
      this.initAddData();
    }
  },
  methods: {
    // 根据 id 获取信息
    getIdDatas(id) {
      getIdData(id).then((res) => {
        if (!res.flag) return;
        this.listData = res.data;
      });
    },
    // 初始化数据
    initAddData() {
      initAddData().then((res) => {
        if (!res.flag) return;
        const data = res.data || {};
        console.log("data", data);
        this.listData = data;
      });
    },
    // 保存 
    save() {
      let item = this.$refs.info.listData
      item.positionList = this.$refs.position.listData.positionList
      if (this.id) {
        addData(item).then((res) => {
          if (!res.flag) return;
          this.$refs.uToast.show({
            type: 'success',
            title: '',
            message: "修改成功",
            complete() {
              uni.navigateBack()
            }
          })
        });
      } else {
        addData(item).then((res) => {
          if (!res.flag) return;
          this.$refs.uToast.show({
            type: 'success',
            title: '',
            message: "保存成功",
            complete() {
              uni.navigateBack()
            }
          })
        });
      }

    },
    tabChange(item) {
      this.componentsName = item.name;
    },
  },
};
</script>

<style lang="scss" scoped>
.input-product {
  width: 95%;
  padding: 0 20upx;
  margin: 30upx auto;
  height: 70upx;
  line-height: 70upx;
  color: #fff;
  display: flex;
}
</style>
